<!doctype html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="./css/normalize.css">
    <link rel="stylesheet" href="./css/mian.css">
</head>
<body>
<!--[if lte IE8]>
<p class="browserupgrade">您浏览器有点老建议你换一个</p>
<![endif]-->
<header>
    <nav class="top">
        <span class="tel">小魏热线：400-888-8888</span>
        <ul>
            <li><a href="#">登录</a></li>
            <li><a href="#">快速注册</a></li>
            <li><a href="#">关于</a></li>
            <li><a href="#">帮助</a></li>
            <li><a href="#">APP下载</a></li>
        </ul>
    </nav>
    <nav class="main">
        <a href="#" class="brand">
            <img src="img/logo@1x.png" alt="回到首页">
        </a>
            <ul>
                <li><a href="#">首页</a></li>
                <li><a href="#">理财频道</a></li>
                <li><a href="#">投资频道</a></li>
                <li><a href="#">新手专区</a></li>
                <li><a href="#">安全保障</a></li>
            </ul>

    </nav>
</header>

<div class="container">
    <!--交易-->
    <section class="transaction">
        <div class="trans-content">
            <div class="trans-data">
                <span>平台累计成交金额</span>
                <span class="trans-money">19888</span>
                <span>万元</span>
            </div>
            <div class="trans-data">
                <span>过去7日成交金额</span>
                <span class="trans-money">19888</span>
                <span>万元</span>
            </div>
            <div class="trans-report">
                <a href="#">查看平台运营报告</a>
            </div>
        </div>
    </section>
    <!--广告-->
    <section class="ad">
        <div class="item">
            <img src="img/ad001.png">
        </div>
        <div class="item">
            <img src="img/ad002.png">
        </div>
        <div class="item">
            <img src="img/ad003.png">
        </div>
    </section>
    <!--亮点介绍-->
    <section class="feature">
        <div class="item">
            <h3>安全</h3>
            <p>国家AAA信用平台 <br> 银行资金托管 <br> 上市公司背景保证 </p>
        </div>
        <div class="item">
            <h3>权威</h3>
            <p>中央电视台推荐 <br> 互联网百强企业 <br> 标准起草单位 </p>
        </div>
        <div class="item">
            <h3>省心</h3>
            <p>100元起投 <br> 用户利益保障机制 <br> 保险公司承担 </p>
        </div>
    </section>
    <!--公告-->
    <section class="notice">
        <a href="#"><span>2018-10-17</span>别人设计的页面，不好，没采用。但是首页有一点点点点可以参考</a>
        <a href="#" class="more">更多公告</a>
    </section>
    <!--产品-->
    <section class="product">
        <h2>
            固定期限产品
            <em>甄选优质基金</em>
            <em>省时省力</em>
            <em>坐等收益</em>
        </h2>
        <div class="product-content">
            <div class="item">
                <h3><em>3</em>个月 <i>日常生活消费</i></h3>
                <div class="info">
                    <p>约定年化收益：<span class="year-rate">3.5% <i>起</i> </span></p>
                    <p>总成交金额：<span class="money">1880 <i>起</i> </span></p>
                </div>
                <div class="buy">
                    <a href="#">购买</a>
                </div>
            </div>
            <div class="item">
                <h3><em>3</em>个月 <i>日常生活消费</i></h3>
                <div class="info">
                    <p>约定年化收益：<span class="year-rate">3.5% <i>起</i> </span></p>
                    <p>总成交金额：<span class="money">1880 <i>起</i> </span></p>
                </div>
                <div class="buy">
                    <a href="#">购买</a>
                </div>
            </div>
            <div class="item">
                <h3><em>3</em>个月 <i>日常生活消费</i></h3>
                <div class="info">
                    <p>约定年化收益：<span class="year-rate">3.5% <i>起</i> </span></p>
                    <p>总成交金额：<span class="money">1880 <i>起</i> </span></p>
                </div>
                <div class="buy">
                    <a href="#">购买</a>
                </div>
            </div>
        </div>
    </section>
    <section class="product">
        <h2>
            固定期限产品
            <em>甄选优质基金</em>
            <em>省时省力</em>
            <em>坐等收益</em>
        </h2>
        <div class="product-content">
            <div class="item">
                <h3><em>3</em>个月 <i>日常生活消费</i></h3>
                <div class="info">
                    <p>约定年化收益：<span class="year-rate">3.5% <i>起</i> </span></p>
                    <p>总成交金额：<span class="money">1880 <i>起</i> </span></p>
                </div>
                <div class="buy">
                    <a href="#">已满标</a>
                </div>
            </div>
            <div class="item">
                <h3><em>3</em>个月 <i>日常生活消费</i></h3>
                <div class="info">
                    <p>约定年化收益：<span class="year-rate">3.5% <i>起</i> </span></p>
                    <p>总成交金额：<span class="money">1880 <i>起</i> </span></p>
                </div>
                <div class="buy">
                    <a href="#">购买</a>
                </div>
            </div>
            <div class="item">
                <h3><em>3</em>个月 <i>日常生活消费</i></h3>
                <div class="info">
                    <p>约定年化收益：<span class="year-rate">3.5% <i>起</i> </span></p>
                    <p>总成交金额：<span class="money">1880 <i>起</i> </span></p>
                </div>
                <div class="buy">
                    <a href="#">购买</a>
                </div>
            </div>
        </div>
    </section>
    <!--内容底部-->
    <section class="footer">
        <div class="footer-content">
            <p class="brand"></p>
            <ul>
                <li class="title">关于我们</li>
                <li><a href="#">公司介绍</a></li>
                <li><a href="#">业务模式</a></li>
                <li><a href="#">合作机构</a></li>
                <li><a href="#">服务协议</a></li>
            </ul>
            <ul>
                <li class="title">风险防范</li>
                <li><a href="#">账户安全</a></li>
                <li><a href="#">安全保障</a></li>
            </ul>
            <ul>
                <li class="title">理财产品</li>
                <li><a href="#">定期保额</a></li>
                <li><a href="#">债权/商标</a></li>
            </ul>
            <ul>
                <li class="title">交易帮助</li>
                <li><a href="#">购买</a></li>
                <li><a href="#">充值</a></li>
                <li><a href="#">体现</a></li>
            </ul>
            <ul>
                <li class="title">机构服务</li>
                <li><a href="#">机构中心</a></li>
                <li><a href="#">合作联系</a></li>
            </ul>
        </div>
    </section>
</div>
<!--底部-->
<footer>
    <ul>
        <li><span class="icon icon-zfwxk">支付业务许可证</span></li>
        <li><span class="icon icon-pcirk">PCI认证</span></li>
        <li><span class="icon icon-visayz">Visa 验证</span></li>
        <li><span class="icon icon-vsjmfw">VerSign加密服务</span></li>
        <li><span class="icon icon-wlgs">网络工商</span></li>
        <li><span class="icon icon-rzcx">电子商务协会认证诚信网</span></li>
        <li><span class="icon icon-gs">北京工商</span></li>
    </ul>
    <p>西安某互联网金融公司 版权所有 @ 2015-2020</p>
</footer>
</body>
</html>